<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet"  href="yangshi.css">
    <title>猫眼电影—娱乐看猫眼</title>
</head>

<body>
    <!-- 导航栏的实现 -->
    <header>
        <div class="shang">
            <a href="" class="biaoqian">
                <img src="../maoyan/maoyan image/猫眼电影.png" alt="">
            </a>
            <div class="sis">
                <div class="select"></div>
            </div>
            <div class="include">
                <ul>
                    <li><a href="" class="first">首页</a></li>
                    <li><a href="">电影</a></li>
                    <li><a href="">影院</a></li>
                    <li><a href="">演出</a></li>
                    <li><a href="">榜单</a></li>
                    <li><a href="">热点</a></li>
                    <li><a href="">商城</a></li>
                </ul>
            </div>
            <div class="download">
                <a href=""><img src="../maoyan/maoyan image/下载图标.png" alt=""></a>
                <span class="text">APP下载</span>
                <div class="select"></div>
            </div>
            <div class="search">
                <input type="search" class="search" maxlength="32" placeholder="找影视剧，影人，影院">
                <input type="submit" class="submit" value="">
            </div>
            <div class="login">
                <img src="../maoyan/maoyan image/登入人像.png" alt="">
                <div class="select"></div>
            </div>
        </div>
    </header>
    <!-- 左栏内容实现 -->
    <!-- 热映电影 -->
    <div class="content">
        <div class="dl">
            <span class="reying">正在热映（44部）</span>
            <div class="all"><span class="text">全部</span><img src="../maoyan/maoyan image/全部.png" alt=""></div>
            <dl class="movie-list">
                <dt>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/灌篮高手.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/忠犬八公.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/铃芽之旅.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/泰坦尼克号.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                </dt>
                <dt>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/人生路不熟.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/龙马精神.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/宇宙探索编辑部.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/长空之王.jpg" alt="">
                        <div class="ticket">购 票</div>
                    </div>
                </dd>
                </dt>
            </dl>
         <!-- 即将上映电影 -->
            <span class="text2">即将上映（84部）</span>
            <div class="all_another"><span class="text">全部</span><img src="../maoyan/maoyan image/全部蓝.png" alt=""></div>
            <dl class="movie-list">
                <dt>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/再看我一眼.jpg" alt="">
                        <div class="ticket1">72662人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/怒吼.jpg" alt="">
                        <div class="ticket1">1572人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/难忘1935.jpg" alt="">
                        <div class="ticket1">5851人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月26日上映</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/长空之王.jpg" alt="">
                        <div class="ticket1">1240人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                </dt>
                <dt>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/这么多年.jpg" alt="">
                        <div class="ticket1">44人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/人生路不熟.jpg" alt="">
                        <div class="ticket1">146783人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/倒数说爱你.jpg" alt="">
                        <div class="ticket1">27071人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/惊天救援.jpg" alt="">
                        <div class="ticket1">7917人想看</div>
                        <div class="booking">
                            <div class="reserve1">预告片</div>
                            <div class="reserve2">预售</div>
                        </div>
                        <div class="data">4月28日上映</div>
                    </div>
                </dd>
                </dt>
            </dl>
            <!-- 热映电影 -->
            <span class="text1_1">热播电影</span>
            <ul class="movie-type">
                <li>爱情</li>
                <li>喜剧</li>
                <li>动作</li>
                <li>恐怖</li>
                <li>动画</li>
            </ul>
            <div class="all"><span class="text">全部</span><img src="../maoyan/maoyan image/全部.png" alt=""></div>
            <dl class="movie-list">
                <dt>
                <dd>
                    <div class="movie-intro_1">
                        <img src="../maoyan/maoyan image/山河故人.jpg" alt="">
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/风暴.jpg" alt="">
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/诗.jpg" alt="">
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/厉鬼将至.jpg" alt="">
                    </div>
                </dd>
                </dt>
                <dt>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/恐怖电影院.jpg" alt="">
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/战狼.jpg" alt="">
                    </div>
                </dd>
                <dd>
                    <div class="movie-intro">
                        <img src="../maoyan/maoyan image/寻龙诀.jpg" alt="">
                    </div>
                </dd>
                </dt>
            </dl>
        </div>
        <!-- 右栏内容实现 -->

        <div class="dr">
            <div class="panel1">
                <h2 class="text3">今日票房</h2>
                <ul class="ranking-box">
                    <li class="ranking-top">
                        <div class="ranking-top-left">
                            <img src="../maoyan/maoyan image/小灌篮高手.png" alt="">
                        </div>
                        <div class="ranking-top-right">
                            <div class="text5">
                                <span class="text4">灌篮高手</span>
                                <p class="ranking-top-num">4858.77万</p>
                            </div>
                        </div>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index1">2</i>
                        <span class="ranking-name">铃芽之旅</span>
                        <span class="ranking-num">79.3万</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index1">3</i>
                        <span class="ranking-name">忠犬八公</span>
                        <span class="ranking-num">71.29万</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">4</i>
                        <span class="ranking-name">龙马精神</span>
                        <span class="ranking-num">54.77万</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">5</i>
                        <span class="ranking-name">超级马力欧兄弟大电影</span>
                        <span class="ranking-num">53.43万</span>
                    </li>
                </ul>
            </div>
            <div class="panel2">
                <div class="banner">
                    <p>今<br>日<br>大<br>盘</p>
                </div>
                <div class="data">
                    <div class="box-office"><b>5391.1</b>&nbsp;万</div>
                    <div class="more">查看更多&nbsp;<img src="../maoyan/maoyan image/全部.png" alt=""></div>
                    <div class="notes">北京时间 10:58:16猫眼专业版实时票房数据</div>
                </div>
            </div>
            <div class="panel3">
                <h2 class="text3">最受期待</h2>
                <div class="all"><span class="text">查看完整榜单</span><img src="../maoyan/maoyan image/全部橙.png" alt=""></div>
                <ul class="ranking-box">
                    <div class="ranking-top">
                        <img src="../maoyan/maoyan image/小这么多年.jpg" alt="">
                        <div class="top-intro">
                            <span class="intro1">这么多年</span><br>
                            <span class="intro2">上映时间：2023-04-08</span><br>
                            <span class="intro3">295500人想看</span>
                        </div>
                    </div>
                    <div class="ranking-second">
                        <div class="next-intro">
                            <img src="../maoyan/maoyan image/速度与激情.jpg" alt="">
                            <span class="intro1">速度与激情10</span><br>
                            <span class="intro3">221723人想看</span>
                        </div>
                    </div>
                    <div class="ranking-third">
                        <div class="next-intro">
                            <img src="../maoyan/maoyan image/天空之城.jpg" alt="">
                            <span class="intro1">天空之城</span><br>
                            <span class="intro3">209973人想看</span>
                        </div>
                    </div>
                    <li class="ranking-next">
                        <i class="ranking-index">4</i>
                        <span class="ranking-name">银河护卫队</span>
                        <span class="ranking-num">313964人想看</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">5</i>
                        <span class="ranking-name">人生路不熟</span>
                        <span class="ranking-num">171237人想看</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">6</i>
                        <span class="ranking-name">长空之王</span>
                        <span class="ranking-num">145767人想看</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">7</i>
                        <span class="ranking-name">倒数说爱你</span>
                        <span class="ranking-num">189042人想看</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">8</i>
                        <span class="ranking-name">检查风云</span>
                        <span class="ranking-num">174885人想看</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">9</i>
                        <span class="ranking-name">前任4:英年早婚</span>
                        <span class="ranking-num">299563人想看</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">10</i>
                        <span class="ranking-name">惊天救援</span>
                        <span class="ranking-num">55894人想看</span>
                    </li>
                </ul>
            </div>

            <div class="panel4">
                <h2 class="text3">TOP 100</h2>
                <div class="all"><span class="text">查看完整榜单</span><img src="img/icon_3.png" alt=""></div>
                <ul class="ranking-box">
                    <li class="ranking-top">
                        <div class="ranking-top-left">
                            <img src="../maoyan/maoyan image/我不是药神.jpg" alt="">
                        </div>
                        <div class="ranking-top-right">
                            <div class="text5">
                                <span class="text4">我不是药神</span>
                                <p class="ranking-top-num">9.6分</p>
                            </div>
                        </div>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index2">2</i>
                        <span class="ranking-name">肖申克的救赎</span>
                        <span class="ranking-num">9.5分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index2">3</i>
                        <span class="ranking-name">绿皮书</span>
                        <span class="ranking-num">9.5分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">4</i>
                        <span class="ranking-name">海上钢琴师</span>
                        <span class="ranking-num">9.3分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">5</i>
                        <span class="ranking-name">哪吒之魔童降世</span>
                        <span class="ranking-num">9.6分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">6</i>
                        <span class="ranking-name">霸王别姬</span>
                        <span class="ranking-num">9.4分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">7</i>
                        <span class="ranking-name">美丽人生</span>
                        <span class="ranking-num">9.3分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">8</i>
                        <span class="ranking-name">小偷家族</span>
                        <span class="ranking-num">8.1分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">9</i>
                        <span class="ranking-name">这个杀手不太冷</span>
                        <span class="ranking-num">9.4分</span>
                    </li>
                    <li class="ranking-next">
                        <i class="ranking-index">10</i>
                        <span class="ranking-name">怦然心动</span>
                        <span class="ranking-num">8.9分</span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <footer>
        <p>关于猫眼 : <span>关于我们</span> | <span>管理团队</span> | <span>投资者关系</span> &nbsp;&nbsp;&nbsp;&nbsp; 友情链接 : <span>美团网</span>
            | <span>格瓦拉</span> | <span>美团下载</span> | <span>欢喜首映</span><br>
            商务合作邮箱：v@maoyan.com 客服电话：10105335 违法和不良信息/涉未成年人有害信息举报电话：4006018900<br>
            用户举报/涉未成年人有害信息举报邮箱：tousujubao@meituan.com 舞弊线索举报邮箱：wubijubao@maoyan.com<br>
            中华人民共和国增值电信业务经营许可证 京B2-20190350 营业性演出许可证 京演（机构）（2019）4094号<br>
            广播电视节目制作经营许可证 （京）字第08478号 网络文化经营许可证 京网文（2019）3837-369号<br>
            猫眼用户服务协议 猫眼平台交易规则总则 隐私政策<br>
            京公网安备 11010102003232号 京ICP备16022489号-1<br>
            北京猫眼文化传媒有限公司<br>
            ©2022 猫眼电影 www.maoyan.com<br>
        <div class="img">
            <a href=""><img src="../maoyan/maoyan image/底图1.png" alt=""></a>
            <a href=""><img src="../maoyan/maoyan image/底图2.png" alt=""></a>
            <a href=""><img src="../maoyan/maoyan image/底图3.png" alt=""></a>
        </div>
    </footer>
</body>

</html>
